const app = new Vue({
    el: '#app',
    data: {
        books: [
            {id:1, name:'<<算法导论>>', date: '2006-9', price: 85,count: 1},
            {id:2, name:'<<UNIX编程艺术>>', date: '2006-2', price: 59,count: 1},
            {id:3, name:'<<编程珠玑>>', date: '2008-10', price: 39,count: 1},
            {id:4, name:'<<代码大全>>', date: '2006-3', price: 128,count: 1}
        ]
    },
    methods: {
        decr(index){
            if(this.books[index].count > 1){
                this.books[index].count--
            }
        },
        incr(index){
            this.books[index].count++
        },
        removeBook(index){
            this.books.splice(index,1)
        }
    },
    filters:{ //过滤器
        showPrice(price){
            return '¥' + Number(price).toFixed(2)
        }
    },
    computed: {
        totalPrice(){
            //1、普通的for循环
            // let totalPrice = 0
            // for(let i = 0; i < this.books.length; i++) {
            //     totalPrice += (this.books[i].price * this.books[i].count)
            // }
            // return totalPrice

            //2、for in直接获取数组索引
            // let totalPrice = 0
            // for(let i in this.books){
            //     totalPrice += (this.books[i].price * this.books[i].count)
            // }
            // return totalPrice

            //3、for of直接获取数组的每一项
            // let totalPrice = 0
            // for(let book of this.books){
            //     totalPrice += book.price * book.count
            // }
            // return totalPrice

            return this.books.reduce(function(preValue,book){
                return preValue + book.price * book.count
            },0)
        }
    }
})